<template>
	<div class="content">
		<div class="register">
			<!--版权登记-->
			<div class="copyrightRegistration">
				<div class="title">版权登记</div>
				<div class="text">
					<p>我国著作权法第三条规定的各类作品均可申请登记。包括：文字作品；口述作品；音乐、 戏剧、曲艺、舞蹈、杂技艺术作品；美术、建筑作品；摄影作品；电影作品和以类似摄制电影的方法创作的作品；工程设计图、产品设计图、地图、示意图等图形作品和模型作品；计算机软件；法律、行政法规规定的其它作品。
					</p>
					<!--<router-link to="copyRightStep01">-->
					<button @click="copyRight()" style="cursor: pointer">在线登记</button>
					<!--</router-link>-->
				</div>
			</div>
			<!--登记流程-->
			<div class="copyrightRegistration">
				<div class="title-b">登记流程</div>
				<div class="text">
					<ul class="program clear">
						<li>
							<img src="../assets/u708.png" alt="">
							<p>1、在线注册</p>
						</li>
						<li>
							<img src="../assets/u710.png" alt="">
							<p>2、提交申请</p>
						</li>
						<li>
							<img src="../assets/u712.png" alt="">
							<p>3、通过审查</p>
						</li>
						<li>
							<img src="../assets/u714.png" alt="">
							<p>4、颁发证书</p>
						</li>
					</ul>
				</div>
			</div>
			<!--所需材料-->
			<div class="copyrightRegistration">
				<div class="title-b">所需材料</div>
				<div class="text">
					<ul class="data">
						<li>（1）《作品著作权登记申请表》；</li>
						<li>（2）申请人身份证明文件复印件；</li>
						<li>（3）权利归属证明文件；</li>
						<li>（4）作品的样本（可以提交纸介质或者电子介质作品样本）；</li>
						<li>（5）作品说明书（请从创作目的、创作过程、作品独创性三方面写，并附申请人签章，标明签章日期）；</li>
						<li>（6）委托他人代为申请时，代理人应提交申请人的授权书（代理委托书）及代理人身份证明文件复印件。</li>
					</ul>
				</div>
			</div>
			<!--常用模板-->
			<div class="copyrightRegistration">
				<div class="title-b">常用模板</div>
				<div class="text">
					<ul class="template clear">
						<li>作品登记申请表填写说明.docx</li>
						<li>合作协议.docx</li>
						<li>权利保证书.docx</li>
						<li>委托协议.docx</li>
						<li>作品说明书.docx</li>
						<li>著作权归属协议.docx</li>
						<li>法人作品声明.docx</li>
						<li>非职务作品创作证明.docx</li>
					</ul>
				</div>
			</div>
		</div>

	</div>
</template>

<script>
import { isreal } from "@/api/index";
import { mapState, mapMutations } from "vuex";
export default {
	computed: {
		...mapState([
			'croUser',
		]),
	},
	methods: {
		...mapMutations([
			'OUT_LOGIN',
		]),
        copyRight() {
			this.$router.push("/copyright");
			return
			if(!this.croUser){
				this.OUT_LOGIN();
				this.$router.push('/login');
				return
			}
            let para = {
                user_id: this.croUser.user_id
            };
            isreal(para).then(res => {
				if (res.data) {
					this.$router.push("/copyright");
				}else if(res.tologin) {
					this.OUT_LOGIN();
					this.$router.push('/login');
				}else {
					this.$message.error(res.msg);
				}
            });
        }
    }
};
</script>
<style lang="scss" scoped>
.clear:after {
    display: block;
    clear: both;
    content: "";
}

.content {
    min-width: 1200px;
    background-color: #f7f7f7;
    padding: 15px 0 20px 0;
    .register {
        width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
        border: 1px solid #e9e9e9;
        background-color: #fff;
        .copyrightRegistration {
            padding-bottom: 30px;
            & > .title {
                text-indent: 15px;
                font-size: 16px;
                font-weight: bolder;
                line-height: 3;
            }
            & > .title-b {
                text-indent: 15px;

                font-size: 16px;
                line-height: 3;
            }
            .text {
                width: 90%;
                margin: 0 auto;
                & > p {
                    font-size: 15px;
                    line-height: 1.8;
                }
                button {
                    width: 150px;
                    height: 40px;
                    color: #fff;
                    background-color: #169bd5;
                    margin: 30px auto 0;
                    display: block;
                    font-size: 15px;
                }
                .program {
                    & > li {
                        float: left;
                        width: 25%;
                        text-align: center;
                        & > img {
                            width: 50px;
                            height: 50px;
                        }
                        & > p {
                            line-height: 2;
                            font-size: 15px;
                            cursor: context-menu;
                        }
                    }
                }
                .data {
                    & > li {
                        font-size: 13px;
                        line-height: 2;
                    }
                }
                .template {
                    & > li {
                        float: left;
                        font-size: 13px;
                        line-height: 3;
                        padding: 0 15px 0 10px;
                        color: #0c569a;
                    }
                }
            }
        }
    }
}
</style>
